<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <style>
       /* dl > dd{
            display: none;
        }
        .open > dd{
            display: block;
        } */

    </style>
    <script src="data.js"></script>
    <script>
	 /* 思路：
		  1.递归获取父级下所有子级
            根据pid和id进行关联是否是父子级菜单
            最终是将所有递归获得的数据渲染到页面，所以递归函数需要有返回值;
          2.展开收缩：
            找到当前元素，如果是展开的，直接收缩；
            如果是收缩的，获取当前元素下的所有ul标签，将所有同级元素全部隐藏，再将当前元素进行显示  */

		
    </script>
</head>
<body>
    <div class="outer">

    </div>
    <!-- <dl class="open">
        <dt>微云</dt>
        <dd>
            <dl >
                <dt>云</dt>
                <dd>
                    <dl>
                        <dt>云云</dt>
                    </dl>
                </dd>

            </dl>
            <dl>
                <dt>yun</dt>
            </dl>
        </dd> -->


    <!-- </dl> -->
    
</body>
</html>